{% set title = "Minha Conta" %}
{% extends 'layout.html' %}

{% block body %}
<div class="container">
  <div class="panel">
    <div class="panel-body">
      {% if messages.success %}
      <div role="alert" class="alert alert-success">
        {% for success in messages.success %}
        <div>{{ success.msg }}</div>
        {% endfor %}
      </div>
      {% endif %}
      {% if messages.error %}
      <div role="alert" class="alert alert-danger">
        {% for error in messages.error %}
        <div>{{ error.msg }}</div>
        {% endfor %}
      </div>
      {% endif %}
      <form method="POST" action="/account?_method=PUT" class="form-horizontal">
        <legend>Informações pessoais</legend>
        <div class="form-group">
          <label for="email" class="col-sm-3">E-mail</label>
          <div class="col-sm-7">
            <input type="email" name="email" id="email" class="form-control" value="{{ user.email }}">
          </div>
        </div>
        <div class="form-group">
          <label for="email" class="col-sm-3">Username</label>
          <div class="col-sm-7">
            <input type="username" name="username" id="username" class="form-control" value="{{ user.username }}">
          </div>
        </div>
        <div class="form-group">
          <label for="name" class="col-sm-3">Nome</label>
          <div class="col-sm-7">
            <input type="text" name="name" id="name" class="form-control" value="{{ user.name }}">
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3">Gênero</label>
          <div class="col-sm-3">
            <label class="radio-inline radio col-sm-3">
              <input type="radio" name="gender" value="male" {% if user.gender == 'male' %}checked{% endif %}><span>Male</span>
            </label>
            <label class="radio-inline col-sm-3">
              <input type="radio" name="gender" value="female" {% if user.gender == 'female' %}checked{% endif %}><span>Female</span>
            </label>
          </div>
        </div>
        <div class="form-group">
          <label for="location" class="col-sm-3">Local</label>
          <div class="col-sm-7">
            <input type="text" name="location" id="location" class="form-control" value="{{ user.location }}">
          </div>
        </div>
        <div class="form-group">
          <label for="website" class="col-sm-3">Website</label>
          <div class="col-sm-7">
            <input type="text" name="website" id="website" class="form-control" value="{{ user.website }}">
          </div>
        </div>
        <div class="form-group">
          <label class="col-sm-3">Gravatar</label>
          <div class="col-sm-4">
            <img src="{{ user.gravatar }}" class="profile" width="100" height="100">
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-offset-3 col-sm-4">
            <button type="submit" class="btn btn-success">Atualizar Perfil</button>
          </div>
        </div>
      </form>
    </div>
  </div>
  <div class="panel">
    <div class="panel-body">
      <form method="POST" action="/account?_method=PUT" class="form-horizontal">
        <legend>Redefinir Senha</legend>
        <div class="form-group">
          <label for="password" class="col-sm-3">Nova Senha</label>
          <div class="col-sm-7">
            <input type="password" name="password" id="password" class="form-control">
          </div>
        </div>
        <div class="form-group">
          <label for="confirm" class="col-sm-3">Confirmar Senha</label>
          <div class="col-sm-7">
            <input type="password" name="confirm" id="confirm" class="form-control">
          </div>
        </div>
        <div class="form-group">
          <div class="col-sm-4 col-sm-offset-3">
            <button type="submit" class="btn btn-success">Mudar Senha</button>
          </div>
        </div>
      </form>
    </div>
  </div>
  <div class="panel">
    <div class="panel-body">
      <div class="form-horizontal">
        <legend>Redes Sociais</legend>
        <div class="form-group">
          <div class="col-sm-offset-3 col-sm-4">
          {% if user.facebook %}
          <p><a href="/unlink/facebook" class="text-danger">Deslogar sua conta do Facebook</a></p>
          {% else %}
          <p><a href="/auth/facebook">Ligar sua conta do Facebook</a></p>
          {% endif %}
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="panel">
    <div class="panel-body">
      <form method="POST" action="/account?_method=DELETE" class="form-horizontal">
        <legend>Excluir Conta</legend>
        <div class="form-group">
          <p class="col-sm-offset-3 col-sm-9">Você pode excluir sua conta de usuário, mas saiba que isso não pode ser desfeito.</p>
          <div class="col-sm-offset-3 col-sm-9">
            <button type="submit" class="btn btn-danger">Deletar minha conta</button>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>
{% endblock %}
